html,body {
    overflow: auto;
}
.loading-container {
    position: fixed;
    height: 100%;
    width: 100%;
    background: gray;
    top: 0;
    z-index: 2000;
    opacity:0.6;
    filter:alpha(opacity=60); /* For IE8 and earlier */
    text-align: center;
}
.loading-img {
    width: 30%;
    margin-top: -20%;
}
.loading-logo-img {
    width: 80%;
    margin-top: 0;
}
/*event day*/
.actual-event-date
{
    font-size: 1em; /* change icon size */
    display: block;
    position: relative;
    width: 15em;
    height: 15em;
    background-color: #fff;
    margin: 2em auto;
    border-radius: 0.6em;
    box-shadow: 0 1px 0 #bdbdbd, 0 2px 0 #fff, 0 3px 0 #bdbdbd, 0 4px 0 #fff, 0 5px 0 #bdbdbd, 0 0 0 1px #bdbdbd;
    overflow: hidden;
    -webkit-backface-visibility: hidden;
    -webkit-transform: rotate(0deg) skewY(0deg);
    -webkit-transform-origin: 50% 10%;
    transform-origin: 50% 10%;
}

.actual-event-date *
{
    display: block;
    width: 100%;
    font-size: 1em;
    font-weight: bold;
    font-style: normal;
    text-align: center;
}

.actual-event-date strong
{
    font-size: 2em;
    position: absolute;
    top: 0;
    padding: 0.4em 0;
    color: #fff;
    background-color: #fd9f1b;
    border-bottom: 1px dashed #f37302;
    box-shadow: 0 2px 0 #fd9f1b;
}

.actual-event-date em
{
    font-size: 1.5em;
    position: absolute;
    bottom: 0.3em;
    color: #fd9f1b;
}

.actual-event-date span
{
    width: 100%;
    font-size: 5em;
    letter-spacing: -0.05em;
    padding-top: 1em;
    color: #2f2f2f;
}
/*Event Calendar*/
.current {
    color: #0099ff;
}
.btn-next-container .btn-next, .btn-finish-container .btn-finish {
    margin-top: 2em;
    float: right;
}
.calendar {
    font-family: Arial;font-size: 12px;
    width: 100%;
}
table.calendar {
    margin: auto; border-collapse: collapse;
}
.calendar .days td {
    width: 80px; height: 80px; padding: 4px;
    border: solid 1px #999;
    vertical-align: top;
    background-color: #ccccff;
}
.calendar .days td:hover {
    background-color: #FFF;
}
.calendar .highlight {
    font-weight: bold; color: #00F;
}
.week-day {
    text-align: center;
    font-size: 17px;
}
.month-text {
    font-size: 20px;
}
.event-process-location {
    margin: 0 0 1em 0;
}
.calendar ul{
    list-style-type: none;
    padding: 0;
}
/*Error and Success Messages*/
input.error, select.error, textarea.error {
    border: dotted 1px #FF0000;
}
.required-error, .error-msg, label.error{
    color: #FF0000;
}
.success-msg{
    color: #00AA00;
}
.margin-top {
    margin-top: 1em;
}
.invalid-old-pass {
    color: #FF0000;
}
/*all pages*/
.page-container {
    margin-top: 2%;
    background: #fff;
    border-radius: 2px;
    box-shadow: 2px 2px 10px black;
}
/*dashboard page*/
.background-bg {
    height: 100%;
    background: url("../images/background.png") no-repeat center center;
    background-size: cover;
    background-attachment:fixed;
}
.bg-none {
    box-shadow: none;
    background: transparent;
    border: none;
}
.put-on-top{
    z-index: 900;
}
/*Login Page*/
#login-page{
    background: #b1dfee;
}
.login-body {
    background: none;
}
.form-signin{
    max-width: 330px;
    padding: 15px;
    margin: 0 auto;
}
.form-signin .form-signin-heading{
    margin-bottom: 10px;
}
.form-signin .checkbox{
    font-weight: normal;
}
.form-signin .form-control{
    position: relative;
    font-size: 16px;
    height: auto;
    padding: 10px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
.form-signin .form-control:focus{
    z-index: 2;
}
.form-signin input[type="text"]{
    margin-bottom: -1px;
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
}
.form-signin input[type="password"]{
    margin-bottom: 10px;
    border-top-left-radius: 0;
    border-top-right-radius: 0;
}
.account-wall{
    margin-top: 20px;
    /*padding: 40px 0px 20px 0px;*/
    background-color: #f7f7f7;
    -moz-box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.3);
    -webkit-box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.3);
    box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.3);
    opacity: 0.8;
    filter:alpha(opacity=40);
}.login-title{
    color: #555;
    font-size: 18px;
    font-weight: 400;
    display: block;
}
.profile-img{
/*    top: 30px;*/
    position: relative;
    left: -25px;
    margin: 0 auto 10px;
    display: block;
}
.need-help{
    margin-top: 10px;
}
.new-account{
    display: block;
    margin-top: 10px;
}
/*Files*/
#files, #venue, #event-type, #general-checklist, 
#employees-tab, #clients-tab, #supplier-tab,
#inbox, #sentbox, #draft,
#event-details-tab,#event-supplier-tab,#event-checklist-tab,#event-task-tab,#event-supplier-list,
#view-event-supplier-tab,#view-event-details-tab, #venue-tab{
    margin-top: 1em;
}
.file-filter, .venue-filter, .event-type-filter,
.employee-filter, .client-filter, .supplier-filter,
.inbox-filter, .sentbox-filter, .draft-filter{
    margin-bottom: 1em;
}
.hide-element {
    display: none;
}
/*My Account*/
.upload-profile-pic-container {
    border-radius: 3px;
    border-top: solid 1px #cccccc;
    margin: 1em;
    padding-top: 1em;
}
.add-a-row, .add-e-row, .add-c-row {
    cursor: pointer;
}
/*Dashbboard*/
.bbem-user {
    color:#ffffff;
/*    border: solid 1px #33cc00;
    border-radius: 2px;
    background: #ffffff;
    text-align: center;*/
}
.bbem-row{
    margin-top: 3em;
}
.bbem-icons{
    margin-top: 50px;
}
/*  ======================Events======================  */
.view-supplier-services{
    padding: 1em;
    border: solid 1px #999999;
    border-radius: 3px;
    width:100%;
    height:100%;
    background-color:#dddddd;
}
.view-event-modal-container {
    width: 80%;
}
.unassign-supplier, .show-sub-cat, .hide-sub-cat, .remove-cat, .sub-cat-item span,
.btn-remove-task{
    cursor: pointer;
}
/*#cal-view, #list-view, #create-event-detail-menu, #create-event-details-tab, #create-event-supplier-tab, 
#create-event-checklist-tab,#create-coord-task-tab,#view-event-detail-menu, #view-event-details-tab, 
#view-event-supplier-tab, #view-event-checklist-tab,#view-coord-task-tab {
        display:none;
}

#cal-view, #list-view, #create-event-details-tab, #create-event-supplier-tab, 
#create-event-checklist-tab, #-create-coord-task-tab {
        padding-left:15px;
}*/

#organizer-nav {
    /*    width:185px;
        height:645px;
        border-left:solid 1px;
        border-right:solid 1px;*/
}

#create-event-btn, #list-view-btn, #cal-view-btn{
    /*    margin-bottom:30px;*/
}

#form-nav {
    text-align:right;
}

#organizer-head {
    padding:21px;
    margin-left:185px;
    margin-top:-645px;
    border-bottom:solid 1px;
    text-align:right;
}

#content {
    margin-left:185px;
    padding-left:5px;
    padding-right:5px;
}

#foot {
    text-align:right;
    padding:8px;
    border:solid 1px;
}
/*-------------calentar venue tab----------------*/
#venue-tab {
    display: none;
}

#venue-main-container,#reload-venue-main-container{
    width: 83%;
    border: #ccc solid thin;
    margin:5px auto;
    display: none;
}

#venue-main-details,#venue-main-working-area,#reload-venue-main-details,#reload-venue-main-working-area{
    display: inline-block;
    vertical-align: top;
    height: 430px;
    padding: 5px;
    margin: 6px;
}

#venue-main-details,#reload-venue-main-details{
    border: #ccc solid thin;
    width: 25%;
}

#venue-main-working-area,#reload-venue-main-working-area{
    width: 60%;
}

#venue-sub-container,#reload-venue-sub-container{
    width: 90%;
    border: black solid thin;
    margin:5px auto;
    position: relative;
}

#tool-img-con,#venue-sub-working-area,#reload-tool-img-con,#reload-venue-sub-working-area{
    border: #ccc solid thin;
    height: 430px;
    padding: 5px;
    margin: 5px;
    vertical-align: top;
}

#tool-img-con,#reload-tool-img-con{
    width: 25%;
    float: left;
}

#img-con div,#reload-img-con div{
    display: inline-block;
    vertical-align: top;
    border: #888 solid thin;
    border-radius: 5px;
    width: 43%;
    height: 80px;
    margin: 5px;
    text-align: center;
}

#tool-img-con img,#reload-tool-img-con img{
    /*width: 80%;*/
    max-width: 80%;
    max-height:60px; 
    padding: 5px;
    margin: 4px auto;
    vertical-align: middle;
}

#venue-sub-working-area,#reload-venue-sub-working-area{
    width: 72%;
    float: right;
}

#tool-type,#reload-tool-type{
    margin-bottom: 10px;
}

#img-con,#reload-img-con{
    overflow: hidden;
    height: 380px;
}

#sub-toolbar,#reload-sub-toolbar{
    display: block;
}

#floor-label{
    margin-top: 20px;
}

#floor-desc{
    resize: none;
    margin-top: 15px;
    height: 300px;
}

#displayed-desc,#displayed-label,#reload-displayed-desc,#reload-displayed-label{
    text-align: center;
}
/* *****create event***** */
#create-event-detail-menu {
    margin-top:10px;
}
/* *****view event***** */
.view-detail{
    color:blue;
}
/*side menu style===========================================*/
.bt-menu {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 0;
    z-index: 100;
    border-width: 0px;
    border-style: solid;
    border-color: #333;
    background-color: rgba(0,0,0,0);
    -webkit-backface-visibility: hidden;
    -webkit-transition: border-width 0.3s, background-color 0.3s, height 0s 0.3s;
    transition: border-width 0.3s, background-color 0.3s, height 0s 0.3s;
}
.bt-menu.bt-menu-open { 
    height: 100%;
    border-width: 0px 0px 0px 170px;
    background-color: rgba(0,0,0,0.3);
    -webkit-transition: border-width 0.3s, background-color 0.3s;
    transition: border-width 0.3s, background-color 0.3s;
}

.bt-overlay {
    position: absolute;
    width: 100%;
}

.bt-menu-open .bt-overlay {
    height: 100%;
}
.bt-menu-trigger {
    position: fixed;
    top: 10px;
    left: 15px;
    display: block;
    width: 3%;
    height: 60px;
    cursor: pointer;

}
.bt-menu-trigger span {
    position: absolute;
    top: 50%;
    left: 0;
    display: block;
    width: 80%;
    height: 8%;
    background-color: #fff;
    border-radius: 2px;
    font-size: 0px;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -webkit-transition: background-color 0.3s;
    transition: background-color 0.3s;
}

.bt-menu-trigger span:before,
.bt-menu-trigger span:after {
    position: absolute;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #fff;
    border-radius: 2px;
    content: '';
    -webkit-transition: -webkit-transform 0.3s;
    transition: transform 0.3s;
}

.bt-menu-trigger span:before {
    -webkit-transform: translateY(-250%);
    transform: translateY(-250%);
}

.bt-menu-trigger span:after {
    -webkit-transform: translateY(250%);
    transform: translateY(250%);
}

.bt-menu-open .bt-menu-trigger span:before {
    -webkit-transform: translateY(-300%);
    transform: translateY(-300%);
}

.bt-menu-open .bt-menu-trigger span:after {
    -webkit-transform: translateY(300%);
    transform: translateY(300%);
}

.bt-menu ul {
    position: fixed;
    margin: 0;
    padding: 0;
    list-style: none;
    display: none;
}

.bt-menu ul:first-of-type {
    top: 75px;
    left: 0;
}

.bt-menu ul:nth-of-type(2) {
    right: 0;
    bottom: 0;
}

.bt-menu ul li,
.bt-menu ul li a {
    display: block;
}
.bt-menu ul:nth-of-type(2) li {
    float: left;
}

.bt-menu ul li {
    visibility: hidden;
    opacity: 0;
    -webkit-transition: -webkit-transform 0.3s, opacity 0.2s, visibility 0s 0.3s;
    transition: transform 0.3s, opacity 0.2s, visibility 0s 0.3s;
}

.bt-menu.bt-menu-open ul:first-of-type li,
.bt-menu.bt-menu-open ul:nth-of-type(2) li {
    visibility: visible;
    opacity: 1;
    -webkit-transition: -webkit-transform 0.3s, opacity 0.3s 0.1s;
    transition: transform 0.3s, opacity 0.3s;
}

/* First menu */
.bt-menu ul:first-of-type li {
    width: 85%;
    height: 50px;
    line-height: 50px;
    -webkit-transform: translate3d(-100%,50%,0);
    transform: translate3d(-100%,50%,0);
}

.bt-menu.bt-menu-open ul:first-of-type li {
    -webkit-transform: translate3d(0,0,0);
    transform: translate3d(0,0,0);
}

/* Second menu */
.bt-menu ul:nth-of-type(2) li {
    width: 60px;
    height: 100px;
    line-height: 50px;
    -webkit-transform: scale(0);
    transform: scale(0);
}

.bt-menu.bt-menu-open ul:nth-of-type(2) li:first-child { 
    -webkit-transition-delay: 0.1s;
    transition-delay: 0.1s;
}

.bt-menu.bt-menu-open ul:nth-of-type(2) li:nth-child(2) { 
    -webkit-transition-delay: 0.2s;
    transition-delay: 0.2s;
}

.bt-menu.bt-menu-open ul:nth-of-type(2) li:nth-child(3) { 
    -webkit-transition-delay: 0.3s;
    transition-delay: 0.3s;
}

.bt-menu.bt-menu-open ul:nth-of-type(2) li:nth-child(4) {
    -webkit-transition-delay: 0.4s;
    transition-delay: 0.4s;
}

.bt-menu.bt-menu-open ul:nth-of-type(2) li {
    -webkit-transform: scale(1);
    transform: scale(1);
}
.adjust-icon {
    margin-right: 10px;
}
.bt-menu ul li a {
    width: 160px;
    display: block;
    outline: none;
    text-decoration: none;
}

.bt-menu ul:first-of-type li a {
    padding: 0 20px;
    box-shadow: inset 0 1px rgba(0,0,0,0.2);
    color: #fff;
    text-transform: uppercase;
    letter-spacing: 1px;
    font-size: 1em;
    -webkit-transition: color 0.2s;
    transition: color 0.2s;
}

.bt-menu ul:first-of-type li:last-child a {
    box-shadow: inset 0 1px rgba(0,0,0,0.2), inset 0 -1px rgba(0,0,0,0.2);
}

.bt-menu ul:nth-of-type(2) li a {
    color: transparent;
    text-align: center;
    font-size: 0px;
}

.bt-menu ul li a:before {
    color: #fff;
    font-size: 24px;
    -webkit-transition: color 0.2s;
    transition: color 0.2s;
}

.bt-menu ul:first-of-type li a:hover,
.bt-menu ul:first-of-type li a:focus,
.bt-menu ul li a:hover:before,
.bt-menu ul li a:focus:before {
    color: #4EE2EC;
}
/*end side menu styles ===================*/
#schedule-container{
    margin:auto;
    width:90%;
    overflow: scroll;
}
#new-area ,#update-area {
    min-height:200px;
    min-width:90%;
    max-width:90%;
    margin:auto;
}
#new-schedule-btn, #update-schedule-btn, #export-schedule-btn{
    margin-left:30px;
}
#new-schedule-form .btn-save,#edit-schedule-form .btn-save{
    margin-left:50px;
    margin-bottom:30px;
}
#new-schedule-form .btn-cancel,#edit-schedule-form .btn-cancel{
    margin-left:10px;
    margin-bottom:30px;
}

/*--------------guest------------------*/
/*#guest-title{
    position:relative;
    border: 1px solid transparent;
    color: #000;
    height: 100%;
    width: 70%;
    text-align: left;
    top: 10px;
    overflow: no-content;
    display: inline;
}
.skip_back{
    position: relative;
    top: 10px;
    bottom: 200px;
    margin-right: 100px;
}
#guest-title_con{
    margin-bottom: 25px;
    margin-left: 150px;
    clear: both;
}
#invi_con{
    text-align: center;
}

#choose_invi{
    margin: 10px 30px 10px 12px; ; 
    float: left;
    width: 35%;
    height: 430px;
    display: inline-block;
    vertical-align: top;
}
#preview{
    vertical-align: top;
    border: 1px solid #ccc;
    height: 430px;
    width: 35%;
    float: right;
    display: inline-block;
    position: relative;
    margin: 10px 12px 30px auto ; 
    -moz-border-radius: 4px;
    border-radius: 4px;
    margin-bottom: 30px;
    background-repeat: no-repeat;
    background-size: 80% 90%;
    background-position: center;
}

picture{   
    border: 2px solid #999;
    width: 140px;
    height: 170px;
    margin-bottom: 1%;
    margin-left: 5%;
    margin-right: 2%;
    margin-top: 2%;
    -moz-border-radius: 4px;
    border-radius: 4px;
    display: inline-block;
    cursor: pointer;
}

.design-pic{
    height: 100%;
    width:100%;
}

#save{
    height: 100%;
    font-weight: bold;
    font-size: 1.2em;
    width: 100%;
    text-align: center;
}

#guest-details-right,#guest-details-left{
    width: 35%;
    display: inline-block;
    position: relative;
    vertical-align: top;
}

#guest-event-title-con{
    width: 79%;
}*/

#progress_bar{
    font-size: .8em;
    width: 100%;
    margin: auto;
    margin-top: 10px;
    height: 48px;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    border-radius: 4px;
    
}
#progressbar_con{
    background-repeat:repeat-x;
    text-align:center;
    margin:0px;
    padding:0px;
    line-height:1.0;
    height:45px;
    width: 100%;
}

.left{
    float:left;
    
}
.right{
    float:right
}

ul#progress_bar{
    border:1px solid #ccc;
    margin:0px 0px 20px;
    padding:0px;
    float:left;
    background: repeat-x top left #e9e9ea
}
ul#progress_bar li{
    list-style:none;
    float:left;
    color:#555;
    font-size:1.5em;
    overflow:hidden;
    padding:0px;
    margin:0px;
    text-align:center;
    cursor:default;
    width:  20%;
    height: 100%;
}
ul#progress_bar li.hover:hover{
    background-color:activecaption;
    background-image:none;
}
ul#progress_bar li.selected{
/*    background:repeat-x top left #e9e9ea;  
    background: #C9C9C9;  old browsers 
    background: -moz-linear-gradient(top, #0C91EC 0%, #257AB6 100%);  firefox 
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#0C91EC), color-stop(100%,#257AB6));  webkit */
    font-weight:bold;
    color: #000;
    background-color: #b2dba1 ; /*color of backround*/
}
ul#progress_bar li.last{
    border-right:none
}
ul#progress_bar li.first{
    border-left:none;
}
ul#progress_bar li a, ul#progress_bar li a:link,ul#progress_bar li a:visited, ul#progress_bar li a:active{
    font-size:1em;
    text-decoration:none;
    display:block;
}

#title_con{ 
    border: 1px solid transparent;
    width: 100%;
    height: 50px;
    margin-bottom: 30px;
}

#title{
    border: 1px solid transparent;
    color: #000;
    height: 100%;
    width: 70%;
    text-align: left;
    float:left;
    margin-top: 0px;
    overflow: no-content;
    display: inline;
    font-family: serif;
    
}

#skip_back{
    float: right;
    text-align: right;
    margin-top:0px;
}

#preview{
    border: 1px solid #ccc;
    height: 430px;
    width: 45%;
    float: right;
    position: relative;
    margin: 10px 12px 0px auto ; 
    -moz-border-radius: 4px;
    border-radius: 4px;
    margin-bottom: 30px;
    background-repeat: no-repeat;
    background-size: 80% 90%;
    background-position: center;


}
#choose_invi{
    margin: 10px 0px 10px 12px; ; 
    float: left;
    width: 45%;
    height: 430px;
}

picture{   
    border: 2px solid #999;
    width: 120px;
    height: 150px;
    margin-bottom: 1%;
    margin-left: 5%;
    margin-right: 2%;
    margin-top: 2%;
    -moz-border-radius: 4px;
    border-radius: 4px;
    display: inline-block;
    cursor: pointer;
}
.pic{

    width: 100%;
    height: 100%;
}

.clear{
    clear: both;
}

/*expenses and voucher*/
.money{
    text-align: right;
}

.center{
    text-align: center;
}

#finance{
    margin:1em;
}

.margin-bottom{
    margin-bottom:1em;
}

.size{
    width:73em;
}

#cv-chq-form, #exp-chq-form{
    display:none;
}


#schedule-container{
    margin:0 auto;
    width:90%;
    overflow: auto;
}
#new-area ,#update-area {
    min-height:200px;
    min-width:90%;
    max-width:90%;
    margin:auto;
}
#new-schedule-btn, #update-schedule-btn, #export-schedule-btn{
    margin-left:30px;
}
#new-schedule-form .btn-save,#edit-schedule-form .btn-save{
    margin-left:50px;
    margin-bottom:30px;
}
#new-schedule-form .btn-cancel,#edit-schedule-form .btn-cancel{
    margin-left:10px;
    margin-bottom:30px;
}
#u-area, #s-area{
    margin-top:20px;
}
/*END of side menu style===========================================*/
